<!doctype html>
<html lang="en">
    <head>
        <meta http-equiv="Content-Language" content="en" />
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Image Cropper: jQuery Real-world Demo</title>

        <script type="text/javascript" src="../../../jquery-1.2.6.js"></script>
        <script type="text/javascript" src="../../../ui/ui.core.js"></script>
        <script type="text/javascript" src="../../../ui/ui.resizable.js"></script>
        <script type="text/javascript" src="../../../ui/ui.draggable.js"></script>

        <script type="text/javascript" src="../../../ui/effects.core.js"></script>
        <script type="text/javascript" src="../../../ui/effects.bounce.js"></script>
        <script type="text/javascript" src="../../../ui/effects.scale.js"></script>

        <link href="image-cropper.css" type="text/css" rel="stylesheet" />

        <script type="text/javascript" src="image-cropper.js"></script>
    </head>
    <body>
        <div id="sidebar">
            <ul class="thumbs">
                <li><a href="#" title="Open This Image"><img src="img/img01.jpg"/></a></li>
                <li><a href="#" title="Open This Image"><img src="img/img02.jpg"/></a></li>
                <li><a href="#" title="Open This Image"><img src="img/img03.jpg"/></a></li>
                <li><a href="#" title="Open This Image"><img src="img/img04.jpg"/></a></li>
                <li><a href="#" title="Open This Image"><img src="img/img05.jpg"/></a></li>
        </div>
    </div>
    <div id="main">
        <div id="header">
            <h2>jQuery Real-world Demo: Image Cropper</h2>
        </div>
        <div id="content">
            <div id="_Wrapper">
                <div id="_Container_Image"></div>
                <div id="_Container"></div>
            </div>
        </div>
        <div id="break">
            <strong>Properties:</strong>
            <ul>
                <li>width: <span id="log-width">0px</span></li>
                <li>height: <span id="log-height">0px</span></li>
                <li>top: <span id="log-top">0px</span></li>
                <li>left: <span id="log-left">0px</span></li>
            </ul>
        </div>
    </div>
</body>
</html>
